{% set shoppingCart = catalog.getShoppingCart %}
<header class="head">
	{% partial 'index/index-special-banner' %}
	<ul class="logoBox flexBox">
		<li class="muneBtn">
			<div><img src="{{ 'assets/img/nav/menu.png'|theme }}" alt="" width="28"></div>
		</li>

		<li class="logo"><a href="/"><img src="{{ 'assets/img/nav/logo.png'|theme }}" alt=""></a></li>

		<li class="top_search"><a href="javascript:;"><img src="{{ 'assets/img/nav/icon-sear.png'|theme }}" alt=""  width="28"></a></li>

		<li class="top_cart">
			<a href="{{ 'checkout/cart'|page}}">
				<img src="{{ 'assets/img/nav/mybag.png'|theme }}" alt=""  width="28">

				{% if shoppingCart.totalQty > 0 %}
				<span class="cartNum">{{ count(shoppingCart.items) }}</span>
				{% endif %}
			</a>
		</li>
	</ul>
	<ul class="index_nav_tab">
		<li>
			<a href="javascript:void(0);" class="current">女の子</a>
		</li>
		<li>
			<a href="javascript:void(0);">男の子</a>
		</li>
		<li>
			<a href="javascript:void(0);">赤ちゃん</a>
		</li>
	</ul>
	<!--<div style="height: 62px;min-width: 1px;"></div>-->
	<!--  -->
	<div class="indexSearch hide">
		<form action="/search-bootstrap" method="get"">
			<div class="suggest_side">
				<input title="検索キーワード" maxlength="100" placeholder="商品名・品番・キーワードで探す" name="q" class="keywords" autocomplete="off" type="text" value="{{ this.param.keyword ?: '' }}">
				<input class="searchBtn" type="submit" value="検索">
			</div>
			<!--<span class="fl" id="cancel-search">キャンセル</span>-->
		</form>
	</div>
	<!--<hr color="#cacaca" size="1">-->

	<div id="topMenu">
	    <ul class="ulMenu">
	        <li>
	            {% if user.email %}
	            <div class="Header" style="position:relative;height:60px;background-color: #E8DCDC;">
	                <span class="header_right_item_icon sprite_common menu_mypage" style="width:40px;height:40px;top:10px;background:url({{'assets/img/menu-logo2.png'|theme}})">
		                {% if op >0 %}
		                <a href="{{ 'account/dashboard'|page }}"  class="cartNum" style="color:#fff;">
							<span>
								{{ op }}
							</span>
		                </a>
		                {% endif %}
	                </span>
	                <a href="{{ 'account/dashboard'|page }}" style="width:auto;height:100%;line-height:80px;text-indent:55px;">Hi, {{ user.name }} 様!</a>
	            </div>
	            {% else %}
	            <div class="Header" style="height:60px;background-color: #E8DCDC;">
	                <span class="header_right_item_icon sprite_common menu_login" style="width:40px;height:40px;top:10px;background:url({{ 'assets/img/menu-logo.png'|theme }})"></span>
	                <a href="{{ 'account/login'|page }}" style="width:100%;height:100%;line-height:80px;text-indent:45px;">ログイン/新規登録</a>
	            </div>
	            {% endif %}
	        </li>
	        <li style="overflow: hidden;padding: 0 15px;">
				{% if user.id %}
				<span class="fl">最終ログイン {{ user.last_login |date('Y-m-d H:i')}}</span>
				{% endif %}

	        </li>
	    </ul>
	    <ul class="ulMenu p40">
	    	<li>
	            <div class="Header"><a href="/">ホーム</a></div>
	        </li>
	        <li>
	            <div class="Header"><a href="{{ 'account/wishlist'|page }}">お気に入り</a></div>
	        </li>
	        <li>
	            <div class="Header"><a href="/daily-new.html">新入荷</a></div>
	        </li>
	        <li>
	            <div class="Header"><a href="/bestseller.html">売れ筋商品</a></div>
	            <hr>
	        </li>
			<li>
				<div class="Header" style="background-color: #E8DCDC;">カテゴリ</div>
			</li>

			<!-- index_Nav -->
			{% for cate in catalog.categories() %}
			   {% if cate.is_enabled==1 %}
				   {% if cate.id == 5 %}
				   		{% for subcate in cate.children %}							
							<li>
					            <div class="Header mune_ mune_{{ subcate.id }}">
					            	<span class="icon_{{ subcate.id }}"></span>
					                {{ subcate.name }}
					                <span class="points_show">
					                	ポイント<span>{{ getCategoryPoint(subcate.id) }}</span>倍
					                </span>
					                <span class="arrow"></span>
					            </div>
					            {% if subcate.children %}
					            <div class="Content">
					                <ul>
										{% if count(subcate.children) %}
										<li><a href="{{ subcate.url }}?rel=home">All&nbsp;&nbsp;&nbsp;<span class="txtGray"></span></a></li>
										{% endif %}
										{% for grandchild in subcate.children %}
										{% if grandchild.is_enabled==1%}
										<li><a href="{{ grandchild.url }}?rel=home">{{ grandchild.name }} &nbsp;&nbsp;&nbsp;<span class="txtGray"></span></a></li>
										{% endif %}
										{% endfor %}
					                </ul>
					            </div>
					            {% endif %}
					        </li>
						{% endfor %}
				   {% else %}
				   		<li>
				            <div class="Header mune_ mune_{{ cate.id }}">
				            	<span class="icon_{{ cate.id }}"></span>
				                {{ cate.name }}
				                <span class="points_show">
				                	ポイント<span>{{ getCategoryPoint(cate.id) }}</span>倍
				                </span>
				                <span class="arrow"></span>
				            </div>
				            {% if cate.children %}
				            <div class="Content">
				                <ul>
									{% if count(cate.children) %}
									<li><a href="{{ cate.url }}?rel=home" >All&nbsp;&nbsp;&nbsp;<span class="txtGray"></a></li>
									{% endif %}
									{% for submenu in cate.children %}
									{% if submenu.is_enabled == 1%}
									<li><a href="{{ submenu.url }}?rel=home">{{ submenu.name }} &nbsp;&nbsp;&nbsp;<span class="txtGray"></span></a></li>
									{% endif %}
									{% endfor %}			                    
				                </ul>
				            </div>
				            {% endif %}
				        </li>				   		
					{% endif %}
				{% endif %}
			{% endfor %}
	    </ul>
	    <ul class="ulMenu p45">
	        <li>
	            <div class="Header" style="background-color: #E8DCDC;">メニュー</div>
	        </li>
	        <li>
	            <div class="Header">
	                KOKOMISHOPについて
	                <span class="arrow"></span>
	            </div>
	            <div class="Content">
	                <ul>
	                    <li><a href="{{ 'common/about'|page }}">KOKOMISHOPのご紹介</a></li>
	                    <li><a href="{{ 'common/about-us'|page }}">運営会社情報</a></li>
	                    <!--<li><a href="{{ 'common/security'|page }}">セキュリティ</a></li>
	                    <li><a href="{{ 'common/privacy'|page }}">プライバシーポリシー</a></li>-->
	                    <li><a href="{{ 'common/terms'|page }}">ご利用規約</a></li>
	                    <li><a href="{{ 'common/company'|page }}">特定商取引法表記</a></li>
	                    <!--<li><a href="{{ 'common/contact-us'|page }}">お問合わせする</a></li>-->
	                </ul>
	            </div>
	        </li>
	        <li>
	            <div class="Header">
	            	お問い合わせ
	                <span class="arrow"></span>
	            </div>
	            <div class="Content">
	                <ul>
	                    <li><a href="{{ 'common/faq'|page }}">よくあるご質問一覧</a></li>
	                    <li><a href="{{ 'common/payment'|page }}">お支払い方法</a></li>
	                    <li><a href="{{ 'common/delivery'|page }}">送料と配送</a></li>
	                    <!--<li><a href="{{ 'common/return-policy'|page }}">交換/返品ポリシー</a></li>
	                    <li><a href="{{ 'common/rewardpoints'|page }}">会員サービスのご案内</a></li>-->
	                </ul>
	            </div>
	        </li>
	    </ul>
	    <ul class="ulMenu">
	        <!--<li>
	            <div class="Header" style="background-color: #E8DCDC;">割引/クーポン詳細</div>
	        </li>-->
	        <li>
	            <form style="padding:10px;clear:both;overflow:hidden;">
	                <input class="commonInput_inputText" type="email" placeholder="メールマガでお得な情報＆限定クーポンを送信しております。" name="email"  required style="">
	                <button type="submit" class="button_decide cartButton bgBlue3" data-request="onSubscription" data-request-success="afterSubscription(this, data)" style="">
	                    <span style=""></span>
	                </button>
	            </form>
	        </li>
	    </ul>
	</div>
	<div id="divBox" class="">
	  <div class="divBoxOverlay">
	    <a href="javascript:;">
	      <span class="arrow left"></span>
	    </a>
	  </div>
	</div>

</header>
